<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title></title>
    <link rel="stylesheet" type="text/css" href="../../style/css/user/center.css">
    <script src="../../style/js/jquery-1.8.3.js" type="text/javascript"></script>
    <script src="../../style/js/ajaxfileupload.js"></script>
    <script type="text/javascript">
        var userId;
        $(function () {
            //获取到用户信息并初始化表单
            userId = window.sessionStorage.getItem("userId");
            $.get("../../user/getUserMsg", {userId: userId}, function (res) {
                if (res.code === 500) {
                    alert(res.msg);
                } else if (res.code === 202) {
                    alert("登录失效,请重新登录");
                } else {
                    var imgUrl = "http://127.0.0.1:8080/tomorrowNewsFiles/user/" + userId + "/" + res.data.newFileName
                    document.getElementById("img").innerHTML = "<img src=" + imgUrl + " height='100' width='100'>"
                    $("#id").val(res.data.id);
                    $("#nickName").val(res.data.nickName);
                    $("#email").val(res.data.email);
                    $("#account").val(res.data.account);
                    if (res.data.sex === '女') {
                        $("input[value='女']").attr("checked", true);
                    } else if (res.data.sex === '男') {
                        $("input[value='男']").attr("checked", true);
                    }
                    var birthdayStr = new Date(res.data.birthday)
                    $("#birthday").val(birthdayStr.getFullYear() + "-" + (birthdayStr.getMonth() + 1) + "-" + birthdayStr.getDate());
                    $("#address").val(res.data.address);
                }
            }, "json")
        })

        //将文件上传到服务器user/userId/newFileName,但是不改变数据库文件,而是返回该文件的新文件名,将文件名隐藏到表单中
        function setUserFile() {
            $.ajaxFileUpload({
                    url: '../../user/setUserFile',
                    fileElementId: 'fileID',
                    dataType: 'json',
                    success: function (res) {
                        if (res.code === 500) {
                            alert("服务器忙，请稍后再试")
                        } else {
                            //显示
                            var imgUrl = "http://127.0.0.1:8080/tomorrowNewsFiles/user/" + userId + "/" + res.data
                            document.getElementById("img").innerHTML = "<img src=" + imgUrl + " height='100' width='100'>"
                            //隐藏到表单
                            $("#imgUrl").val(res.data)
                            alert(res.msg);
                        }
                    }
                }
            )
        }

        //保存修改的数据
        function saveAll() {
            $.post("../../user/setMsg", $("#msgForm").serialize(), function (res) {
                if (res.code === 200) {
                    alert(res.msg);
                    //换session*********
                    /*var id = $("#id").val();
                    var nickName = $("#nickNameId").val();
                    var imgName = $("#imgUrl").val()
                    window.sessionStorage.setItem("userId", id);
                    window.sessionStorage.setItem("userNickName", nickName);
                    window.sessionStorage.setItem("userNewFiLeName", imgName);
                    location.reload()*/
                    top.location.replace("../user_login.html")
                } else if (res.code === 500) {
                    alert(res.msg);
                } else {
                    alert("修改失败");
                }
            })
        }
    </script>
</head>
<body>
<div class="public_m1">
    <div class="public_m2">资料管理</div>
    <!--照片和内容-->
    <div class="zp_nrm">
        <!--left-->
        <div class="zp_nrm_l" id="userFile">
            <div id="img">
            </div>
            <input name="userFile" id="fileID" type="file" value="点击更换" accept=".png,.jpg" onchange="setUserFile()"/>
        </div>
        <br>

        <!--right-->
        <form id="msgForm">
            <input type="hidden" id="imgUrl" name="newFileName">
            <input type="hidden" id="id" name="id">
            <div class="zp_nrm_r">
                <p><em>昵称：</em><input id="nickName" name="nickName"></p>
                <p><em>邮箱：</em><input id="email" name="email"></p>
                <p><em>手机号：</em><input id="account" name="account"></p>
                <p><em>性别：</em><input type="radio" name="sex" value="男" class="sex_m"><i>男</i>
                    <input type="radio" name="sex" value="女" class="sex_m"><i>女</i></p>
                <p><em>生日：</em><input id="birthday" name="birthday"></p>
                <p><em>地址：</em><input id="address" name="address"></p>
                <a href="javaScript:void(0)" class="public_m3" onclick="saveAll()">保存修改</a>
            </div>
        </form>

    </div>
</div>
</body>
</html>
